﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="jqmenu_demo.aspx.cs" Inherits="test_jqmenu_demo" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>jqmenu_demo</title>
    <script type="text/javascript" src="../js/jquery-1.3.2.min.js" ></script>
    <script type="text/javascript" src="../js/fg.menu.js" ></script>
    
    <link type="text/css" href="../css/fg.menu.css" media="screen" rel="stylesheet"  />
    <link type="text/css" href="../css/theme/ui.all.css" media="screen" rel="stylesheet" />
    
    <style type="text/css" >
	body { font-size:62.5%; margin:0; padding:0; }
	#menuLog { font-size:1.4em; margin:20px; }
	.hidden { position:absolute; top:0; left:-9999px; width:1px; height:1px; overflow:hidden; }
	
	.fg-button { clear:left; margin:0 4px 40px 20px; padding: .4em 1em; text-decoration:none !important; cursor:pointer; position: relative; text-align: center; zoom: 1; }
	.fg-button .ui-icon { position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -8px; }
	a.fg-button { float:left;  }
	button.fg-button { width:auto; overflow:visible; } /* removes extra button width in IE */
	
	.fg-button-icon-left { padding-left: 2.1em; }
	.fg-button-icon-right { padding-right: 2.1em; }
	.fg-button-icon-left .ui-icon { right: auto; left: .2em; margin-left: 0; }
	.fg-button-icon-right .ui-icon { left: auto; right: .2em; margin-left: 0; }
	.fg-button-icon-solo { display:block; width:8px; text-indent: -9999px; }	 /* solo icon buttons must have block properties for the text-indent to work */	
	
	.fg-button.ui-state-loading .ui-icon { background: url(spinner_bar.gif) no-repeat 0 0; }
	</style>
    
    <script type="text/javascript" language="javascript">
        $(function() {
            $('.fg-button').hover(
    		    function() { $(this).removeClass('ui-state-default').addClass('ui-state-focus'); },
    		    function() { $(this).removeClass('ui-state-focus').addClass('ui-state-default'); }
    	    );
            $('#flat').menu({
                content: $('#flat').next().html(), // grab content from this page
                showSpeed: 200
            });
        });
        function aa() {
            alert("abc");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <br />
        <a tabindex="0" href="#search-engines" class="fg-button fg-button-icon-right ui-widget ui-state-default ui-corner-all" id="flat"><span class="ui-icon ui-icon-triangle-1-s"></span>弹出菜单</a>
        <div id="search-engines" class="hidden">
        <ul>
	        <li><a href="http://www.g.cn" class="type1">Google</a></li>
	        <li><a href="http://www.126.com" class="type2">Yahoo</a></li>
	        <li><a href="#" class="type2">MSN</a></li>
	        <li><a href="http://www.126.com" class="type1">Ask</a></li>
	        <li><a href="http://www.baidu.com" class="type1">Baidu</a></li>
        </ul>
        </div>
    </div>
    </form>
</body>
</html>
